<template>
	<view class="page-wrap" :data-theme="theme" :class="theme" :style="globalColor.style">
		<HeadCustom title="我的文章"  :isAppBtn="false" :isHome="!isApp"></HeadCustom>
		<view class="list">
			<view v-for="(item, index) in listData" :key="index">
				<ArticleItem :index="index" :innerData="item" type="hotmine" @action="articleAction" />
			</view>
			<u-loadmore fontSize="24rpx" :status="listConfig.loading" />
		</view>
		<ModelPublic width="552rpx" titlePosition="center" ref="ModelPublic" title="删除我引用的这篇文章" confirmText="删除" footerPosition="center" @confirm="delArticle" />
	</view>
</template>

<script>
	import ArticleItem from './components/article-item.vue'
	import ModelPublic from '@/components/model-public/index.vue';
	import {hotQuoteList, hotQuoteDel} from '@/api/h5.js';
	import { utf8to16, base64decode } from '@/static/js/Base64.js';
	import { getRequest } from '@/static/js/common.js';
	export default {
		components: {ArticleItem, ModelPublic},
		name: 'aricleMine',
		data() {
			return {
				theme: getApp().globalData.appTheme,
				globalColor: getApp().globalData.globalColor,
				listData: [],
				listConfig: {
					current: 1,
					size: 10,
					count: 0,
					loading: 'loadmore'
				},
				isApp: true,
				actionData: {}
			}
		},
		onLoad(option) {
			if(option && option.benwu){
				let benwu = utf8to16(base64decode(option.benwu))
				this.benwu = option.benwu
				const token = {
					access_token: getRequest(benwu,'token'),
					companyId: getRequest(benwu,'companyId'),
					statusBarHeight: getRequest(benwu,'statusBarHeight'),
					authStatus: getRequest(benwu,'authStatus'),
				}
				getApp().globalData.statusBarHeight = token.statusBarHeight
				getApp().globalData.companyId = token.companyId
				this.companyId = token.companyId
				uni.setStorageSync('bw_params', JSON.stringify(token));
			}
			if(option && option.isApp){
				this.isApp = option.isApp == 1 ? true : false
			}else{
				const {bw_link} = getApp().getBWData(['bw_link'])
				this.isApp = bw_link.isApp == 1 ? true : false
			}
			this.getInit()
			this.getList()
		},
		onShow() {
			console.log('onShow ----- hotMine ----- hotArtcile')
		},
		onHide() {
			console.log('onHide ---------- hotArtcile')
		},
		onUnload() {
			console.log(' onUnload ----- hotMine ----- hotArtcile')
		},
		methods: {
			articleAction(e){
				console.log(e)
				if(e.item.value == 2){
					this.$refs.ModelPublic.show = true
					this.actionData = e
				}else if(e.item.value == 1){
					let con =  e.data.content ? e.data.content.replace(/<\/?.+?>/g,'') : ''
					con =  con.replace(/[\r\n]/g,'')
					const href = `${location.origin}${location.pathname}#/hotArticle/detail?id=${e.data.id}&pageType=1`
					const data = {
						type: 'shareHotArticle',
						link: href,
						title: e.data.title,
						imgUrl: e.data.img,
						desc: con.substr(0,50) || href
					}
					this.$bridge.callHandler('appHandler', data, () => {
						console.log('recruitHandler', '返回')
					})
				}
			},
			delArticle(){
				hotQuoteDel({id: this.actionData.data.id }).then(res=>{
					if(res.data){
						this.$refs.ModelPublic.show = false
						this.listData.splice(this.actionData.dataIndex, 1)
						this.getInit()
						this.getList()
					}
				})
			},
			getInit(){
				this.listConfig = {
					current: 1,
					size: 10,
					count: 0,
					loading: 'loadmore'
				}
				this.listData = []
			},
			getList(){
				hotQuoteList({
					current: this.listConfig.current,
					size: this.listConfig.size,
				}).then(res=>{
					if (this.listData.length) {
						this.listData = this.listData.concat(res.data.list)
					} else {
						this.listData = res.data.list
					}
					this.listLoading(res)
				}).catch(err=>{
					this.listConfig.loading = 'nomore'
				})
			},
			listLoading(res) {
				if (res.data.total == 0) {
					this.listConfig.loading = 'list-not'
				} else if (res.data.total < res.data.size || res.data.current * res.data.size >= res.data.total) {
					this.listConfig.loading = 'nomore'
				}
				this.listConfig.count = res.data.total
			},
			listMore() {
				const {
					current,
					size,
					count,
					loading
				} = this.listConfig
				if (loading == 'nomore') {
					return
				}
				if (current * size < count) {
					this.listConfig.current = current + 1
					this.getList()
				} else {
					this.listConfig.loading = 'nomore'
				}
			},
			
		},
		onReachBottom() {
			this.listMore()
		},
		onPullDownRefresh() {
			this.getInit()
			this.getList()
			uni.stopPullDownRefresh(); //停止刷新
		},
	}
</script>

<style lang="scss" scoped>
.list{padding: 40rpx 24rpx 24rpx;}
</style>